/* eslint-disable no-unused-expressions */
import React from "react";
import { connect } from "react-redux";
import { loadGetToShopListDataAsync } from "@/components/main/index/actionCreator";
import { ShowList } from "@/components/main/index/styled";
import { withRouter } from "react-router-dom";

class ShopList extends React.Component {
  render() {
    var data = this.props.toshoplist.toJS().classify_list;
    var showlist = [];
    for (var n in data) {
      showlist.push(data[n]);
    }
    return (
      <ShowList>
        {showlist.map((item, index) => (
          <li onClick={this.toPath.bind(this, item)} key={index}>
            <i>
              <img src={item.pic} alt="" />
              <span>{item.name}</span>
            </i>
          </li>
        ))}
      </ShowList>
    );
  }
  componentDidMount() {
    this.props.loadGetToShopListDataAsync.bind(this)();
  }
  toPath(item) {
    if (item.category_id === 0) {
      // eslint-disable-next-line no-lone-blocks
      ("item.url");
    } else {
      this.props.history.push({
        pathname: "/showList",
        search: "?caid=" + item.category_id
      });
    }
  }
}
const mapStateToProps = state => {
  return {
    currentCity: state.getIn(["indexReducer", "currentCity"]),
    toshoplist: state.getIn(["indexReducer", "toshoplist"])
  };
};
const mapDispatchToProps = dispatch => {
  return {
    loadGetToShopListDataAsync() {
      loadGetToShopListDataAsync(dispatch, {
        city_id: this.props.currentCity.get("city_id")
      });
    }
  };
};
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(ShopList));
